<template>
  <h2>child</h2>
  <h3>msg:{{msg}}</h3>
  <button @click="emitXxx">+</button>
  <!-- <h3>count:{{count}}</h3> -->
</template>
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
  name: 'Child',
  props: ['msg'],
  // beforeCreate () {
  //   console.log('beforeCreate', this)
  // },
  setup (props, context) {
  // setup (props, {attrs, slots, emit}) {
    console.log(props, context)
    console.log(context.attrs.msg2)
    // console.log('setup', this)
    const showMsg1 = () => {
      console.log('setup showMsg1')
    }
    function emitXxx () {
      context.emit('xxx', '++')
    }
    return {
      showMsg1,
      emitXxx
    }
  }
  // data () {
  //   return {
  //     count: 10
  //   }
  // },
  // mounted () {
  //   console.log(this)
  // },
  // methods: {
  //   showMsg2 () {
  //     console.log('showMsg2')
  //   }
  // }
})
</script>
